<template>
  <div class="back">
    <section class="list-content" v-for="(item,index) in arrData" :key="index">
      <div class="icon">
        <img src="https://o6wndwjxn.qnssl.com/%E6%8F%90%E7%8E%B0%E8%AE%B0%E5%BD%95@2x.png">
      </div>
      <div class="content">
        <div class="title">{{item.name}}{{item.cname}}</div>
        <div class="fenxiaoshouyi">{{item.title}}{{item.commission_money}}元</div>
        <div class="shijian">{{item.create_time}}</div>
      </div>
    </section>
  </div>
</template>

<script>
import {
  mapState
} from 'vuex'
import { cashdetails } from '@/api/center'
export default {
  data () {
    return {
      arrData: []
    }
  },
  created () {
    this.getlist()
  },
  computed: {
    ...mapState({
      app_id: state => state.app_id,
      user_id: state => state.member_id
    })
  },
  methods: {
    getlist () {
      let obj = {
        app_id: this.app_id,
        member_id: this.user_id,
        info_id: this.$route.query.info_id
      }
      cashdetails(obj).then(res => {
        this.$store.commit('updateLoadingStatus', { isLoading: false })
        let { code, data } = res.data
        if (code === 200) {
          this.arrData = data
        }
        console.log(code)
      })
    }
  }
}
</script>
<style lang="less" scoped>
.list-content {
  width: 100%;
  height: calc(100vw * 260 / 750);
  display: flex;
  background-color: #fff;
  border-bottom: calc(100vw * 10 / 750) solid #f5f5f5;
}
.icon > img {
  height: calc(100vw * 200 / 750);
  margin: calc(100vw * 28 / 750)  calc(100vw * 53 / 750) 0 calc(100vw * 73 / 750);
}
.content {
  flex: 1;
}
.title {
  font-family: PingFangSC-Regular;
  font-size: calc(100vw * 34 / 750);
  color: #333333;
  padding: calc(100vw * 20 / 750) 0 calc(100vw * 44 / 750) 0;
}
.fenxiaoshouyi {
  font-family: PingFangSC-Regular;
  font-size: calc(100vw * 28 / 750);
  color: #999999;
  letter-spacing: 0;
  margin-bottom: calc(100vw * 47 / 750);
}
.shijian {
  font-family: PingFangSC-Regular;
  font-size: calc(100vw * 28 / 750);
  color: #999999;
  letter-spacing: 0;
}
.back{
 background-color: #F5F5F5;
}
</style>
